<template>
  <div class="tableBox">
    <vxe-table
      ref="xTable1"
      highlight-hover-row
      border
      :data="tableData"
      auto-resize
      :header-row-style="{height:'50px'}"
      :row-style="{height:'40px'}"
      :cell-style="{textAlign: 'center'}"
      height="100%"
      header-align="center"
      @cell-dblclick="tabledblclick"
    >
      <!-- <vxe-table-column type="checkbox" width="60"></vxe-table-column> -->
      <vxe-table-column field="acceptanceFormNum" title="任务单号" />
      <vxe-table-column field="taskName" show-overflow title="任务名称" />
      <vxe-table-column field="startedUserName" title="发布人" width="140px" />
      <vxe-table-column field="startedDate" title="发布时间" />
      <vxe-table-column field="address" title="是否启动流程" width="120px">
        <template #default="{ row }">
          <span>{{ row.address===1?'是':'否' }}</span>
        </template>
      </vxe-table-column>
      <vxe-table-column field="currentModelApprove" title="任务状态" width="120px">
        <template #default="{ row }">
          <span>{{ row.currentModelApprove===1?'是':'否' }}</span>
        </template>
      </vxe-table-column>
    </vxe-table>
  </div>
</template>

<script>
export default {
  props: {
    tableData: {
      type: Array,
      default: () => ({})
    }
  },
  methods: {
    tabledblclick({ row }) {
      this.$emit('tabledblclick', row);
    }
  }
};
</script>

<style lang="scss" scoped>
.tableBox{
  height: 80%;
}
</style>
